<template>
  <div class="stuCorMes">
    <div>
      <div class="message" v-for="item in Message">
        <div class="courseName">课程ID:{{item.cid}}
        </div>
        <div class="status">审核状态:{{item.allow}}</div>
        <div class="time">审核时间:{{item.time}}</div>
        <div>
          <div style="color: red;padding-top: 15px" v-if="item.isRead">已读√</div>
          <el-button type="danger"
                     @click="readMes(item.mid)"
                     icon="el-icon-check"
                     style="margin-top: 8px"
                     circle
                     v-if="!item.isRead">
          </el-button>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  methods:{
    action(){
      this.findStu()

    },
    readMes(mid){
        let _this=this
        this.$axios({
          method:"GET",
          url:"http://localhost/student/readMes/"+mid
        }).then(response => {
          _this.action()
        })
    },
    findStu(){
      let _this=this
      this.$axios({
        method:"GET",
        url:"http://localhost/student/findByUsername/"+_this.username
      }).then(response => {
        let _this=this
        this.$axios({
          method:"GET",
          url:"http://localhost/student/findStuMes/"+response.data.id
        }).then(response => {
          _this.Message=response.data
        })
      })
    },
  },
  mounted() {
    this.username=this.$route.query.username
    this.action()
  },
  data() {
    return {
      Message:[],
      username:'',
      sid:'',
    }
  },
}
</script>

<style scoped>
.stuCorMes{
  position: absolute;
  left: 150px;
  width: 89.9%;
  height: 800px;
  overflow-y: auto;

}
.message{
  margin-left: 300px;
  width: 400px;
  height: 130px;
  border-style:solid;
  border-width:1px;
  border-color: black;
  background-color: aquamarine;
  margin-top: 5px;
}
.courseName{
  padding-left: 5px;
  left: 30px;

}
.status{
  padding-left: 5px;
  left: 30px;
 padding-top: 10px;
}
.time{
  padding-left: 5px;
  left: 30px;
  padding-top: 10px;

}
</style>
